| <html> |
| <head> |
| <script src="jstemplate_compiled.js" type="text/javascript"></script> |
| <script src="tabs_api.js"></script> |
| </head> |
| <body> |
| <div id="windowList"> |
| <div style="background-color: #AAEEEE; margin: 4px; padding: 8px; margin: 20px" jsselect="$this" |
| jsvalues="id:'window_' + id"> |
| <div style="font-style: italic; width: 80px; display: inline-block"> |
| Window: <span jscontent="id"></span> |
| </div> |
| <div style="display: inline-block"> |
| left: <input style="width: 60px" type="text" jsvalues="value:$this.left;id:'left_' + id" /> |
| top: <input style="width: 60px" type="text" jsvalues="value:$this.top;id:'top_' + id" /> |
| width: <input style="width: 60px" type="text" jsvalues="value:$this.width;id:'width_' + id" /> |
| height: <input style="width: 60px" type="text" jsvalues="value:$this.height;id:'height_' + id" /> |
| <input type="checkbox" jsvalues="checked:focused; id:'focused_' + id" /> Focused |
| <input type="checkbox" jsvalues="checked:current; id:'current_' + id" /> Current |
| <button onclick="refreshWindow(this.jstdata);" jsvalues=".jstdata:id">Refresh</button> |
| </div> |
| <div id="tabList"> |
| <div jsselect="tabs"> |
| <div style="background-color: #EEEEEE; margin: 8px; padding: 4px" jsvalues="id:'tab_' + id"> |
| <div style="margin: 8px"> |
| <div style="font-style: italic; width: 80px; display: inline-block" jscontent="'TabId: ' + id"></div> |
| <div style="width: 300px; display: inline-block"> |
| index: <input style="width: 20px" type="text" jsvalues="value:$this.index;id:'index_' + id" /> |
| windowId: <input style="width: 20px" type="text" jsvalues="value:windowId;id:'windowId_' + id" /> |
| <button onclick="moveTab(this.jstdata);" jsvalues=".jstdata:id">Move</button> |
| <button onclick="refreshTab(this.jstdata);" jsvalues=".jstdata:id">Refresh</button> |
| </div> |
| </div> |
| <div style="margin: 8px"> |
| <div> |
| <div style="width: 40px; display:inline-block">title:</div> |
| <input style="width: 90%" type="text" jsvalues="value:title;id:'title_' + id" /> |
| </div> |
| <div> |
| <div style="width: 40px; display:inline-block">url:</div> |
| <input style="width: 90%" type="text" jsvalues="value:url;id:'url_' + id" /> |
| </div> |
| <div><input type="checkbox" jsvalues="checked:selected; id:'selected_' + id" /> Selected</div> |
| </div> |
| <button onclick="updateTab(this.jstdata)" jsvalues=".jstdata:id">Update Tab</button> |
| <button onclick="removeTab(this.jstdata);" jsvalues=".jstdata:id">Close Tab</button> |
| </div> |
| </div> |
| </div> |
| <button onclick="updateWindow(this.jstdata);" jsvalues=".jstdata:id">Update Window</button> |
| <button onclick="removeWindow(this.jstdata);" jsvalues=".jstdata:id">Close Window</button> |
| <button onclick="refreshSelectedTab(this.jstdata);" jsvalues=".jstdata:id">Refresh Selected Tab</button> |
| </div> |
| </div> |
| <div style="background-color: #EEEEBB; margin: 20px; padding: 8px"> |
| <h3 style="text-align: center; margin: 8px"> Create Window</h3> |
| <div style="margin: 8px"> |
| <div style="width: 300px; display: inline-block"> |
| left: <input style="width: 20px" type="text" id="new_window_left" /> |
| top: <input style="width: 20px" type="text" id="new_window_top" /> |
| width: <input style="width: 20px" type="text" id="new_window_width" /> |
| height: <input style="width: 20px" type="text" id="new_window_height" /> |
| </div> |
| </div> |
| <div style="margin: 8px"> |
| <div> |
| <div style="width: 40px; display:inline-block">url:</div> |
| <input style="width: 90%" type="text" id="new_window_url" /> |
| </div> |
| </div> |
| <button onclick="createWindow();">Create</button> |
| </div> |
| <div style="background-color: #EEEEAA; margin: 20px; padding: 8px"> |
| <h3 style="text-align: center; margin: 8px"> Create Tab</h3> |
| <div style="margin: 8px"> |
| <div style="width: 300px; display: inline-block"> |
| index: <input style="width: 20px" type="text" id="index_new" /> |
| windowId: <input style="width: 20px" type="text" id="windowId_new" /> |
| <button onclick="moveTab(this.jstdata);" jsvalues=".jstdata:id">Move</button> |
| </div> |
| </div> |
| <div style="margin: 8px"> |
| <div> |
| <div style="width: 40px; display:inline-block">title:</div> |
| <input style="width: 90%" type="text" id="title_new" /> |
| </div> |
| <div> |
| <div style="width: 40px; display:inline-block">url:</div> |
| <input style="width: 90%" type="text" id="url_new" /> |
| </div> |
| <div><input type="checkbox" id="selected_new" /> Selected</div> |
| </div> |
| <button onclick="createTab();">Create</button> |
| </div> |
| <div style="margin: 20px;"> |
| <button onclick="loadWindowList();">Refresh</button> |
| <button onclick="updateAll();">Update All</button> |
| <button onclick="moveAll();">Move All</button> |
| <button onclick="clearLog();">-->Clear Log</button> |
| <button onclick="chrome.windows.create();">New Window</button> |
| </div> |
| <div id="log" style="background-color: #EEAAEE; margin: 20px; padding: 8px"> |
| </div> |
| </body> |
| </html> |